#container{
    width: 100%;
    height: auto;
    max-width: 46.875rem ;
    min-width: 20rem;
    overflow-x: hidden;
    margin: 0 auto;
    /* background-color: rgb(247, 247, 247); */
}
.header{
    display: flex;
    text-align: center;
    padding-top: 2.1875rem;
    padding-bottom: 1.6875rem;
    background-color: rgb(255, 147, 37);
}
.header img{
    width: 1rem;
    height: 1.875rem;
    margin-left: 2.5rem;
    margin-right: 15.5rem;
    margin-top: .3125rem;
}
.header p{
    font-family: "PingFang";
    font-size: 2.25rem;
    color: white;    
}
.options_items{
    padding: 1.75rem 7.5rem 0rem 7.5rem;
    background-color: rgb(255, 255, 255);
    margin-bottom: 1.9375rem;
}
.options_items ul{
    text-align: center;
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-between;
}
.options_items ul li{
    font-size: 1.75rem;
    font-weight: bold;
    width: 6.25rem;
    color: #999999;
    padding-bottom: 1.375rem;
}
.options_items .active{
    color: black ;
    border-bottom: .3125rem rgb(255, 147, 37) solid;
}
/*  */
.content{
     filter: grayscale(100%);
}

#content{
    display: none;
    width: 44.375rem;
    height: 14.375rem;
    border-radius: 1.25rem;
    margin: 0 auto;
     background: url(../images/rollcenter_BG.png) center no-repeat;
    background-size: cover;
    margin-bottom: 1.75rem;
}
.content_left_top{
    width: 6.25rem;
    height: 6.25rem;
    line-height: 6.25rem;
    text-align: center;
    border-radius: 3.125rem;
    background-color: rgb(255, 77, 58);
    margin: 1.5625rem 2.6875rem 1.25rem 2.8125rem;
}
.content_left_top img{
    width: 3.125rem;
    height: 3.125rem;
}
.content_mid_top .five{
    width: 4.0625rem;
    height: 4rem;
}
.content_left_bottom{
    font-size: 1.625rem;
    color: rgb(255, 77, 58);
    margin-left: 2.8125rem;
    font-weight: bold;
}
.Vertical_bar{
    width: .1875rem;
    height: 5.3125rem;
    margin-top: 4.0625rem;
    margin-right: 2.875rem;
    background-color: rgb(255, 238, 226);
    opacity: 0.5;
}
.content_mid{
    width: 14.75rem;
    margin-top: 1.25rem;
    margin-right: 4.9375rem;
}
.content_mid_top{
    display: flex;
    margin-bottom: 1.3125rem;
}
.content_mid_top img{
    width: 6.625rem;
    height: 4.0625rem;
    margin-right: 1.25rem;
}
.p_three{
    text-align: center;
    width: 6.875rem;
    height: 1.875rem;
    font-size: 1.125rem;
    color: #ff3333;
    margin-top: 2.25rem;
    border-radius: .3125rem;
    background-color: #ff9326;
    background-color: rgba(255, 147, 38, 0.2);
}
.changecolor{
    color: rgb(152, 152, 152);
    background-color: rgb(209, 209, 209);
}
.pOne{
    font-family: PingFang-SC-Regular;
    font-size: 1.5rem;
    color: #666666;
}
.pTwo{
    font-size: 1.375rem;
    color: #999999;
}
.content_rigth{
    width: 8.9375rem;
    height: 3.375rem;
    color: #ffffff;
    text-align: center;
    line-height: 3.375rem;
    border-bottom: 1.6875rem;
    margin-top: 3.9375rem;
    background-color: #a3a3a3;
    border-radius: 1.6875rem;
}
.content_rigth_two img{
    width: 9.875rem;
    height: 7.375rem;
    margin-top: 2.9375rem;
}
.defcolor{
    background-color: #ff4d3a;
}
.content_mid_top .five{
    width: 4.0625rem;
    height: 4rem;
}